<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>HolyCrossCollege</title>
  <link rel="stylesheet" href="style.css">

  
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
  <!--script src="js/slides.min.jquery.js"></script-->
	
	<!--[if IE]>
	<script type="text/javascript">
	(function(){
	var html5elmeents = "address|article|aside|audio|canvas|command|datalist|details|dialog|figure|figcaption|footer|header|hgroup|keygen|mark|meter|menu|nav|progress|ruby|section|time|video".split('|');
	for(var i = 0; i < html5elmeents.length; i++){
	document.createElement(html5elmeents[i]);
	}
	}
	)();
	</script>
	<![endif]-->






<!-- Start visualslideshow.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine/css/slideshow.css" media="screen" /> 
<style type="text/css">.slideshow a#vlb{display:none}</style> 
<script type="text/javascript" src="engine/js/mootools.js"></script> 
<script type="text/javascript" src="engine/js/visualslideshow.js"></script> 
<!-- End visualslideshow.com HEAD section -->

</head>

<body>
	<div id="header-wrap">
		<header class="group">
			<h2><a href="index.html" title="HolyCrossCollege">HolyCrossCollege</a></h2>
			<div id="call">
				<h3>(012) 345 6789</h3>
				<h4 class="green">Call us <strong>now</strong></h4>
			</div><!-- end call -->
			<nav class="group">
				<ul>
					<li class="home"><a href="#" title="">Home</a></li>
					<li><a href="#" title="">Services</a></li>
					<li><a href="#" title="">About Us</a></li>
					<li><a href="#" title="">Testimonials</a></li>
					
				</ul>
			</nav>
		</header>
	</div><!-- end header wrap -->
	
	
<div id="container">
		

<!-- Start visualslideshow.com BODY section -->
<div id="show" class="slideshow"> 
<div class="slideshow-images">
<a href="#"><img id="slide-0" src="data/images/1.jpg" alt="1" title="1" /></a>
<a href="#"><img id="slide-1" src="data/images/2.jpg" alt="2" title="2" /></a>
<a href="#"><img id="slide-2" src="data/images/3.jpg" alt="3" title="3" /></a>
<a href="#"><img id="slide-3" src="data/images/4.jpg" alt="4" title="4" /></a>
<a href="#"><img id="slide-4" src="data/images/5.jpg" alt="5" title="5" /></a>
<a href="#"><img id="slide-5" src="data/images/6.jpg" alt="6" title="6" /></a>
<a href="#"><img id="slide-6" src="data/images/7.jpg" alt="7" title="7" /></a>
<a href="#"><img id="slide-7" src="data/images/8.jpg" alt="8" title="8" /></a>
</div>

</div> 
<!-- End visualslideshow.com BODY section -->
		
		<div id="service">
			
				<div id="web">
					<img src="images/web.png" />
					<h3>Notice <strong><span class="green">Board</span></strong></h3>	
				<p>Nunc viverttra erat et turpis viverra pellentesque. Maecenas ullamcorper, nibh tristique ullamcorper lacinia, tellus nisi blandit elit, id pulvinar tortor.</p>
					<p><a href="#" class="readmore">read more</a></p>
				</div><!-- end web -->
				
				<div id="vector">
					<img src="images/vector.png" />
					<h3>Vector <strong><span class="green">Design</span></strong></h3>	
				<p>Nunc viverttra erat et turpis viverra pellentesque. Maecenas ullamcorper, nibh tristique ullamcorper lacinia, tellus nisi blandit elit, id pulvinar tortor.</p>
					<p><a href="#" class="readmore">read more</a></p>
				</div><!-- end vector -->
		
		</div><!-- end service-->
		
		<div id="media" class="group">
			<div id="video">
				<h4>Quick <strong>Video Tour</strong></h4>
				<h5>How we Design our works!</h5>
				<a href="#" class="play"><img src="images/play.png" alt="play" /></a>
			</div>
	
			<div id="twitter"> 
				<h4>Twitter <strong><span class="green">Feed</span></strong></h4>	
				<p class="tweet">Mashable Video: Principal Resigns After Allegedly Posing as a Student on Facebook -<a href="#" class="t-link">http://on.mash.to/IVYWYJ</a></p>
				<p class="time">9 hours ago</p>
			</div>
			
			<div id="facebook">
				<h4>Like Us On <strong><span class="green">Facebook</span></strong></h4>
			</div>
		</div><!-- end media -->
	</div> <!--! end container -->
	
	<div id="widget-wrap" class="group">
		<div id="widget">
			<div id="links" class="group">
				<h4 class="white">Other <strong>Links</strong></h4>
				<ul>
					<li><a href="#">www.example.com</a></li>
					<li><a href="#">www.1stwebdesigner.com</a></li>
					<li><a href="#">www.labzip.com</a></li>
					<li><a href="#">www.samplelink.com</a></li>
					<li><a href="#">www.outgoinglink.com</a></li>
					<li><a href="#">www.link.com</a></li>
				</ul>
			</div>
			
			<div id="blog">
				<h4 class="footer-header white">Latest From The <strong>Blog</strong></h4>
				<img src="images/blog.png" alt="blog" />
				<p class="title">Maecenas iaculis lorem vel dui vulputate non consequat mi congue.</p>
				<p class="date">05.30.2012</p>
				<p><a href="#" class="readmore">read more</a></p>
			</div><!-- end blog -->
			
			<div id="location">
				<h4 class="footer-header white">Our <strong>Location</strong></h4>
				<img src="images/map.png" alt="map" />
				<p class="address">123 unknown street, address 
				</br> 8600 Philippnes</p>
			</div><!-- end location -->
		</div><!-- end widget -->
	</div> <!--! end widget-wrap -->
	
	<div id="client-wrap" class="group">
		<div id="client">
			<ul>
				<li><img src="images/client-1.jpg" alt="" /></li>
				<li><img src="images/client-2.jpg" alt="" /></li>
				<li><img src="images/client-3.jpg" alt="" /></li>
				<li><img src="images/client-4.jpg" alt="" /></li>
				<li><img src="images/client-5.jpg" alt="" /></li>
			</ul>
		</div><!-- end client -->
	</div><!-- end client-wrap -->
	
	<footer class="group">
		<div id="footer-left">
			<p>Copyright <a href="#" class="green">www.1stwebdesigner.com</a> </br>
			Designed by <a href="#" class="green">Michael Burns</a></p>
		</div>
			
		<div id="footer-right">
			<ul>
				<li><a href="#">Home</a></li>
				<li><a href="#">Services</a></li>
				<li><a href="#">About Us</a></li>
				<li><a href="#">Testimonials</a></li>
				<li><a href="#">Contact Us</a></li>
			</ul>
		</div>
				
		<a href="#header-wrap"><img src="images/back-top.png" alt="back-top" class="back-top" /></a>		
	</footer>
	
	
<script>
		$(function(){
			$('#slides').slides({
				preload: true,
				generateNextPrev: true,	
			});
		});
</script>

</body>
</html>
